<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/mobileStudy.css">
</head>
<body>
<!--弹性盒子           设置宽度为最小宽度    -->
<div id="a1" style="width:100%;height:300px; background-color: #007aff">
    <!--    父容器 子项目 -->
    <span id="a2" style="width:200px;height:200px;background-color: darkorange">
    子项目1
    </span>
    <span id="a3" style="width:200px;height:200px;background-color: darkgreen">
    子项目2
    </span>
    <span id="a4" style="width:200px;height:200px;background-color: darkmagenta">
    子项目3
    </span>
</div>
</body>
</html>